export default {
  low: `@Post('/csrf/low/changePassword')
async csrfLowChangePassword(@Body() { username, newPassword }: CsrfLow) {
  checkEssentialParams(username, newPassword);
  const target = await this.userService.findUser(username, null, () => {
    throw new UserNotFound();
  });
  await this.userService.changeUser(target, { password: md5(newPassword) });
  return {
    msg: 'Password updated successfully!',
  };
}
// --------------------------------------------------------------------------
const Vulnerable: React.FC = () => {
  const [form] = Form.useForm();
  const { t } = useTranslation();
  const { run: changePwd, loading } = useRequest(
    async (params: CsrfChangePwd = form.getFieldsValue()) => {
      await changePwdLow(params).then(res => {
        messageBox.success({ content: res.msg });
      });
    },
    { manual: true },
  );

  return (
    <>
      <Title level={4} italic>
        {t('passwordChange')}
      </Title>
      <Form onFinish={changePwd} form={form} layout="vertical">
        <Form.Item required rules={[{ required: true }]} name="username" label={t('username')}>
          <Input placeholder={t('usernamePlaceholder') as string} />
        </Form.Item>
        <Form.Item
          required
          rules={[{ required: true }]}
          name="newPassword"
          label={t('passwordChangeNew')}
        >
          <Input placeholder={t('passwordPlaceholder') as string} />
        </Form.Item>
      </Form>
      <Button onClick={() => form.submit()} loading={loading}>
        {t('passwordChange')}
      </Button>
    </>
  );
};`,
  mid: `@Post('/csrf/mid/changePassword')
async csrfMidChangePassword(
  @Body() { username, newPassword, csrfToken }: CsrfMid
) {
  checkEssentialParams(username, newPassword, csrfToken);
  // 这里只是模拟csrfToken并没有真实实现（模拟验证）
  if (csrfToken !== 'hahahahaha') {
    throw new ParamsLack();
  }
  return await this.csrfLowChangePassword({ username, newPassword });
}
// --------------------------------------------------------------------------
const Vulnerable: React.FC = () => {
  const [form] = Form.useForm();
  const { t } = useTranslation();
  const { run: changePwd, loading } = useRequest(
    async (params: CsrfChangePwd = form.getFieldsValue()) => {
      await changePwdMid(params).then(res => {
        messageBox.success({ content: res.msg });
      });
    },
    { manual: true },
  );

  return (
    <>
      <Title level={4} italic>
        {t('passwordChange')}
      </Title>
      <Form
        initialValues={{
          csrfToken: 'hahahahaha',
        }}
        onFinish={changePwd}
        form={form}
        layout="vertical"
      >
        <Form.Item required rules={[{ required: true }]} name="username" label={t('username')}>
          <Input placeholder={t('usernamePlaceholder') as string} />
        </Form.Item>
        <Form.Item
          required
          rules={[{ required: true }]}
          name="newPassword"
          label={t('passwordChangeNew')}
        >
          <Input placeholder={t('passwordPlaceholder') as string} />
        </Form.Item>
        <Form.Item hidden noStyle name="csrfToken">
          <Input value="hahahahaha" />
        </Form.Item>
      </Form>
      <Button onClick={() => form.submit()} loading={loading}>
        {t('passwordChange')}
      </Button>
    </>
  );
};`,
};
